<% layout('/layouts/default.html', {title: 'tk_task管理', libs: ['validate','dataGrid']}){ %>
<div class="main-content">
	<div class="box box-main">
		<div class="box-header with-border">
			<div class="box-title">
				任务详情
			</div>
			<div class="box-tools pull-right">
				<button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
			</div>
		</div>
		<#form:form id="inputForm" model="${tkMyTask}" action="${ctx}/tk/tkTask/save" method="post" class="form-horizontal">
			<div class="box-body">
				<#form:hidden path="id"/>
				<div class="row">
					<div class="col-xs-6">
						<div class="form-group">
							<label class="control-label col-sm-4" title="">
								<span class="required hide">*</span> ${text('项目名称/APP名称')}：<i class="fa icon-question hide"></i></label>
							<div class="col-sm-8">
								<#form:input path="projectName" maxlength="255" class="form-control" disabled="true"/>
							</div>
						</div>
					</div>
					<div class="col-xs-6">
						<div class="form-group">
							<label class="control-label col-sm-4" title="">
								<span class="required hide">*</span> ${text('标题')}：<i class="fa icon-question hide"></i></label>
							<div class="col-sm-8">
								<#form:input path="title" maxlength="255" class="form-control" disabled="true"/>
							</div>
						</div>
					</div>
					<div class="col-xs-6">
						<div class="form-group">
							<label class="control-label col-sm-4" title="">
								<span class="required hide">*</span> ${text('商家名称')}：<i class="fa icon-question hide"></i></label>
							<div class="col-sm-8">
								<#form:input value="${tkMyTask.icUserShangjia.nicheng}" maxlength="50" class="form-control" disabled="true"/>
							</div>
						</div>
					</div>
					<div class="col-xs-6">
						<div class="form-group">
							<label class="control-label col-sm-4" title="">
								<span class="required hide">*</span> ${text('描述')}：<i class="fa icon-question hide"></i></label>
							<div class="col-sm-8">
								<#form:input path="explainStr" maxlength="255" class="form-control" disabled="true"/>
							</div>
						</div>
					</div>
					<div class="col-xs-6">
						<div class="form-group">
							<label class="control-label col-sm-4" title="">
								<span class="required hide">*</span> ${text('提交时常')}：<i class="fa icon-question hide"></i></label>
							<div class="col-sm-8">
								<#form:input path="submitTimes" maxlength="10" class="form-control" disabled="true"/>
							</div>
						</div>
					</div>
					<div class="col-xs-6">
						<div class="form-group">
							<label class="control-label col-sm-4" title="">
								<span class="required hide">*</span> ${text('审核时常')}：<i class="fa icon-question hide"></i></label>
							<div class="col-sm-8">
								<#form:input path="examineTimes" maxlength="10" class="form-control" disabled="true"/>
							</div>
						</div>
					</div>
					<div class="col-xs-6">
						<div class="form-group">
							<label class="control-label col-sm-4" title="">
								<span class="required hide">*</span> ${text('设备类型')}：<i class="fa icon-question hide"></i></label>
							<div class="col-sm-8">
								<#form:radio path="devType" dictType="task_dev_type" class="form-control digits" disabled="true"/>
							</div>
						</div>
					</div>
					<div class="col-xs-6">
						<div class="form-group">
							<label class="control-label col-sm-4" title="">
								<span class="required hide">*</span> ${text('做单方式')}：<i class="fa icon-question hide"></i></label>
							<div class="col-sm-8">
								<#form:select path="zuodanNumType" dictType="tk_zuodan_num_type" class="form-control" disabled="true"/>
							</div>
						</div>
					</div>
					<div class="col-xs-6">
						<div class="form-group">
							<label class="control-label col-sm-4" title="">
								<span class="required hide">*</span> ${text('悬赏单价')}：<i class="fa icon-question hide"></i></label>
							<div class="col-sm-8">
								<#form:input path="price" maxlength="8" class="form-control number" disabled="true"/>
							</div>
						</div>
					</div>

<!--					<div class="col-xs-6">-->
<!--						<div class="form-group">-->
<!--							<label class="control-label col-sm-4" title="">-->
<!--								<span class="required hide">*</span> ${text('任务状态')}：<i class="fa icon-question hide"></i></label>-->
<!--							<div class="col-sm-8">-->
<!--								<#form:select path="myTaskStatus" dictType="tk_my_task_status" class="form-control" disabled="true"/>-->
<!--							</div>-->
<!--						</div>-->
<!--					</div>-->
				</div>
			</div>
			<div class="box-footer">
				<div class="row">
					<div class="col-sm-offset-2 col-sm-10">

					</div>
				</div>
			</div>
		</#form:form>
	</div>
	<div class="box box-main">
		<div class="box-header with-border">
			<div class="box-title">
				任务步骤
			</div>
			<div class="box-tools pull-right">
				<button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
			</div>
		</div>
		<div class="box-body">
			<table id="dataGrid"></table>
		</div>
	</div>
	<div class="box box-main">
		<div class="box-header with-border">
			<div class="box-title">
				申诉详情
			</div>
			<div class="box-tools pull-right">
				<button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
			</div>
		</div>
		<#form:form id="inputForm" model="${tkTaskWeiquan}" action="" method="post" class="form-horizontal">
		<div class="box-body">
			<#form:hidden path="id"/>
			<div class="row">
				<div class="col-xs-6">
					<div class="form-group">
						<label class="control-label col-sm-4" title="">
							<span class="required hide">*</span> ${text('任务工单号')}：<i class="fa icon-question hide"></i></label>
						<div class="col-sm-8">
							<#form:input path="code" maxlength="255" class="form-control"  disabled="true"/>
						</div>
					</div>
				</div>
				<div class="col-xs-6">
					<div class="form-group">
						<label class="control-label col-sm-4" title="">
							<span class="required hide">*</span> ${text('维权类型')}：<i class="fa icon-question hide"></i></label>
						<div class="col-sm-8">
							<#form:select path="weiquanType" dictType="tk_weiquan" class="form-control" disabled="true"/>
						</div>
					</div>
				</div>

				<div class="col-xs-6">
					<div class="form-group">
						<label class="control-label col-sm-4" title="">
							<span class="required hide">*</span> ${text('维权原因')}：<i class="fa icon-question hide"></i></label>
						<div class="col-sm-8">
							<#form:textarea path="failExplain" maxlength="255" rows="3" class="form-control" disabled="true"/>
						</div>
					</div>
				</div>
			</div>
			<div class="row">
				<div class="col-xs-6">
					<div class="form-group">
						<label class="control-label col-sm-4" title="">
							<span class="required hide">*</span> ${text('上传图片')}：<i class="fa icon-question hide"></i></label>
						<div class="col-sm-8">
							<% for (pic in picArr){ %>
							<img src="${pic}" alt="" style="width: 100px;" onclick="tanPic('${pic}')">
							<% } %>
						</div>
					</div>
				</div>
			</div>
		</div>
	</#form:form>
	</div>
	<div class="box box-main">
		<div class="box-header with-border">
			<div class="box-title">
				审核流程
			</div>
			<div class="box-tools pull-right">
				<button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
			</div>
		</div>
		<div class="box-body">
			<table id="dataGridLiucheng"></table>
		</div>
	</div>

	<div class="box box-main">
		<div class="box-header with-border">
			<div class="box-tools pull-right">
				<button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
			</div>
		</div>
		<div class="box-body">
			<div style="text-align: center;padding: 50px;">
				<% if(tkTaskWeiquan.shensuStatus=='5'){ %>
				<button type="submit" class="btn  btn-primary" id="btnSubmit" onclick="tongguo(6)"><i class="fa fa-check"></i> ${text('通 过')}</button>&nbsp;
				<button type="submit" class="btn  btn-danger" id="btnSubmitBohui" onclick="tongguo(7)"><i class="fa  fa-remove"></i> ${text('驳 回')}</button>&nbsp;
				<% } %>
				<button type="button" class="btn  btn-default" id="btnCancel" onclick="js.closeCurrentTabPage()"><i class="fa fa-reply-all"></i> ${text('关 闭')}</button>
			</div>
		</div>
	</div>
</div>
<% } %>
<script>
$("#inputForm").validate({
	submitHandler: function(form){
		js.ajaxSubmitForm($(form), function(data){
			js.showMessage(data.message);
			if(data.result == Global.TRUE){
				js.closeCurrentTabPage(function(contentWindow){
					contentWindow.page();
				});
			}
		}, "json");
    }
});
</script>
<script>
	var dataJSON = JSON.parse('${tkMyTask.buzhouList}');
	$('#dataGrid').dataGrid({
		shrinkToFit: false,
		data:dataJSON,
		datatype: "local",
		autoGridHeight:function () {
			return "100%";
		},
		columnModel: [
			{header:'${text("步骤")}', name:'', index:'a.project_name', width:70, align:"center", formatter: function(val, obj, row, act){
				return "第"+obj.rowId+"步";
			}},
			{header:'${text("类型")}', name:'type', index:'a.project_name', width:70, align:"center"},
			{header:'${text("说明")}', name:'shuoming', index:'a.title', width:150, align:"left"},
			{header:'${text("图片/链接/邀请码")}', name:'pic', index:'a.dev_type', width:150, align:"center", formatter: function(val, obj, row, act){
				if(row.type == "输入网址" || row.type.indexOf("复制数据")!=-1){
					return row.shuomingTwo;
				}
				return val && val!=''?'<img src="'+val+'" style="width: 50px" onclick="tanPic(\''+val+'\')" /> ':"";
			}},
			{header:'${text("用户提交的截图/数据")}', name:'pic', index:'a.dev_type', width:150, align:"center", formatter: function(val, obj, row, act){
				if(row.userData != "" && row.userData){
					return row.userData;
				}
				if(row.userPic != "" && row.userPic){
					return row.userPic && row.userPic!=''?'<img src="'+row.userPic+'" style="width: 50px" onclick="tanPic(\''+row.userPic+'\')" /> ':"";
				}
				return "";
			}},
		],
		// 加载成功后执行事件
		ajaxSuccess: function(data){

		}
	});
	var liuchengList = '${liucheng}';
	var liuchengArr = JSON.parse(liuchengList);
	console.log(liuchengList);
	$('#dataGridLiucheng').dataGrid({
		// shrinkToFit: false,
		data:liuchengArr,
		datatype: "local",
		autoGridHeight:function () {
			return "100%";
		},
		columnModel: [
			{header:'${text("状态")}', name:'status', index:'a.status',  align:"center"},
			{header:'${text("说明")}', name:'text', index:'a.title',  align:"left"},
			{header:'${text("图片")}', name:'pics',  align:"center", formatter: function(val, obj, row, act){
				var html = '';
				console.log(val);
				if(val){
					for (let i = 0; i < val.length; i++) {
						html += '<img src="'+val[i]+'" style="width: 50px" onclick="tanPic(\''+val+'\')" /> '
					}
					return html;
				}
				return "";
			}},
		],
		// 加载成功后执行事件
		ajaxSuccess: function(data){

		}
	});

	function tanPic(url) {
		js.layer.photos({
			shade:0.3,
			photos: {
				"title": "抓拍图片", //相册标题
				"id": 123, //相册id
				"start": 0, //初始显示的图片序号，默认0
				"data": [   //相册包含的图片，数组格式
					{
						"src": url, //原图地址
						"thumb": url //缩略图地址
					}
				]
			},
			tab: function(pic, layero){
				console.log(pic) //当前图片的一些信息
			}
		});
	}

	function tongguo(status){
		var id = "${tkMyTask.weiquanId}";
		js.layer.open({
			type: 2,
			title: '说明',
			shadeClose: true,
			// shade: false,
			maxmin: true, //开启最大化最小化按钮
			area: ['60%', '500px'],
			content: "${ctx}/tk/tkTaskWeiquan/caiding?id="+id+"&shensuStatus="+status
		});
	}
</script>